<template>
	<view class="contain">
		<view class="menu" v-for="(item,index) in part" :key="index" @click="navTo(item.latitude,item.longitude)">
			<view class="menuLeft">
				<view class="">{{item.title}}</view>
				<view class=""><text>据您{{item.distence}}</text></view>
			</view>
			<view class="menuRight">
				<!-- <view class=""><image src="../../static/static/tingche1.png" mode=""></image></view> -->
				<view class=""><text>到这去</text></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				part:[
					{
						id:1,
						title:'停车场1',
					    latitude: 39.9091,
					    longitude: 116.391,
					    iconPath: '../../static/static/iconCesuo.png'
					}, {
						id:2,
						title:'停车场2',
					    latitude: 39.9092,
					    longitude: 116.392,
					    iconPath: '../../static/static/iconCesuo.png'
					}, {
						id:3,
						title:'停车场3',
					    latitude: 39.9093,
					    longitude: 116.393,
					    iconPath: '../../static/static/iconCesuo.png'
					}, {
						id:4,
						title:'停车场4',
					    latitude: 39.9094,
					    longitude: 116.394,
					    iconPath: '../../static/static/iconCesuo.png'
					}, {
						id:5,
						title:'停车场5',
					    latitude: 39.9094,
					    longitude: 116.394,
					    iconPath: '../../static/static/iconCesuo.png'
					}, {
						id:6,
						title:'厕所6',
					    latitude: 39.9094,
					    longitude: 116.394,
					    iconPath: '../../static/static/iconCesuo.png'
					}
				]
			}
		},
		methods:{
			navTo(lat,lon){
				wx.openLocation({//​使用微信内置地图查看位置。
				     latitude: lat,//要去的纬度-地址
				     longitude: lon,//要去的经度-地址
				})
			},
			computedDistence(){
				let _this=this;
				this.part.forEach((item,index)=>{
					let juli=_this.distance(_this.latitude,_this.longitude,item.latitude,item.longitude);
					item.distence=juli;
				})
			},
			distance(la1, lo1, la2, lo2) {  
			    var La1 = la1 * Math.PI / 180.0;  
			    var La2 = la2 * Math.PI / 180.0;  
			    var La3 = La1 - La2;  
			    var Lb3 = lo1 * Math.PI / 180.0 - lo2 * Math.PI / 180.0;  
			    var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(La3 / 2), 2)+Math.cos(La1) * Math.cos(La2) * Math.pow(Math.sin(Lb3 / 2), 2)));  
			    s = s * 6378.137;//地球半径  
			    s = Math.round(s * 10000);  
				if(s>1000){
					s = (s/10000).toFixed(2)+'km';
				}else{
					s = s.toFixed(2)+'m';
				}
				return s;
			}
		},
		onLoad(option) {
			const userLocation=uni.getStorageSync('userLocation');
			console.log(userLocation)
			const arr=userLocation.split(',')
			this.latitude=Number(arr[1]);
			this.longitude=Number(arr[0]);
			this.computedDistence();
		}
	}
</script>

<style lang="scss" scoped>
	.contain{
		padding: 0 20rpx;
		color: #000;
	}
	.menu{
		height: 140rpx;
		padding: 30rpx 30rpx 0;
		display: flex;
		justify-content: space-between;
		border-bottom: 1rpx solid #f5f5f5;
		.menuLeft{
			height: 140rpx;
			text{
				color: #666;
			}
			view:nth-child(2){
				margin: 10rpx 0 0 10rpx;
				font-size: 26rpx;
			}
		}
		.menuRight{
			text-align: center;
			image{
				width: 40rpx;
				height: 40rpx;
			}
			text{
				font-size: 24rpx;
			}
		}
	}

</style>
